<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <script type="text/javascript">
    window.FBL = {};
    window.onload = function()
    {
        with(FBL)
        {
            var parentNode = document.getElementById("out");
            
            // --------------------------------------------------------------
            // DomPlate test goes here
            // --------------------------------------------------------------
            
            var inputData = ["Honda", "Chevrolet", "Toyota", "Ford", "Pontiac",
                "Dodge", "Mazda", "Nissan", "Volkswagen", "Hyundai"];

            var template = domplate(
            {
              tag:
                DIV(
                  FOR("brand", "$carBrands",
                    DIV({"class": "carBrand $brand|getBrandClass",
                         $myFaforite: "$brand|isMyFavorite"},
                      "$brand"
                    )
                  )
                ),
            
              isMyFavorite: function(brand) {
                return (brand == "Nissan");
              },
            
              getBrandClass: function(brand) {
                return "brand-" + brand;
              }
            });
            
            template.tag.replace({carBrands: inputData}, parentNode, template);

            // --------------------------------------------------------------
        }    
    }    
  </script>
  <script src="../../content/firebug/domplate.js" type="text/javascript"></script>
  <style type="text/css">
    .carBrand {
      font-weight: bold;
    }
    
    .myFaforite {
      color: red;
    }
    
    .brand-Ford {
      color: green;
    }
  </style>
  </head>
  <body>
  
  <h1 id="header">DomPlate Test</h1>
  <div id="comment"><i>This is just a test file</i><hr/></div>
  <div id="out"></div>

  </body>
</html>
